// 基于axios做封装
// 1. 实例化 + 2. 俩个拦截器
import axios from 'axios'
import store from '@/store'
// 实例化
const instance = axios.create({
  baseURL: 'http://pcapi-xiaotuxian-front-devtest.itheima.net',
  timeout: 10000
})

// 请求拦截器 - 全局注入token
instance.interceptors.request.use(config => {
  // 从本地拿到token 注入请求头 requestHeaders
  const token = store.state.user.profile.token
  if (token) {
    // 这里存入的字段属性是后端要求的 token的拼接方式也是后端要求的
    // 必须按照这个来 后端才能正常获取你的token数据
    config.headers.Authorization = `Bearer ${token}`
  }
  return config
}, e => Promise.reject(e))

// 响应拦截器 - token失效跳回到登录页（401） 前端自行判断成功还是失败
instance.interceptors.response.use(res => res.data, e => {
  return Promise.reject(e)
})

// 1. 直接导出instance实例供API使用   2. 再次封装一个方法 供API使用

// 需求
/**
  用法：
    request('url','GET',{name:'cp'}).then(res=> console.log(res))
  前提：
    小兔鲜项目请求方法method只有俩种要么是 get 要么是post

  优化: 程序健壮性
   如果现在用这个函数的人传过来的method参数 Get GET 会有问题？
   内部统一先把method转化成全小写 然后再做比较
 */

function request (url, method, reqData) {
  // 逻辑: 发送请求
  return instance({
    url,
    method,
    // 兼容对象key 如果method get -> params  如果method post -> data
    [method.toLocaleLowerCase() === 'get' ? 'params' : 'data']: reqData
  })
  // 返回值: promise 一定要有return 不能丢失 否则不可以.then
}

export default request
